<template>

  <el-dialog
    :visible.sync="dialogVisible"
    :close-on-click-modal="false"
    title="阅卷出分"
    width="600px"
    @close="handleClose"
  >
    <div class="err-box">
      <div>1、系统将自动汇总成绩并发布。</div>
      <div>2、本操作不可撤销，确认后将自动执行成绩发布及证书发放流程。</div>
      <div>3、已完成的成绩记录将不再重复处理。</div>
    </div>

    <el-form ref="postForm" :model="postForm" label-position="left" label-width="80px">

      <el-form-item label="强制出分">
        <el-checkbox v-model="postForm.force" /> 不校验审阅和阅卷状态、直接出分!!
      </el-form-item>

    </el-form>

    <div slot="footer" class="dialog-footer">
      <el-button @click="handleClose">取 消</el-button>
      <el-button :loading="loading" type="primary" @click="handleSettle">确 定</el-button>
    </div>


  </el-dialog>


</template>

<script>

import { settle } from '@/api/exam/review/paper'

export default {
  name: 'ReviewSettleDialog',
  props: {
    examId: String,
    ids: Array,
    visible: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      loading: false,
      dialogVisible: false,

      postForm: {
        examId: '',
        auditState: 1,
        force: false,
        autoSettle: false,
        paperIds: []
      }
    }
  },
  watch: {

    // 检测查询变化
    visible: {
      handler() {
        this.dialogVisible = this.visible
      }
    },

    ids: {
      handler(val) {
        this.postForm.paperIds = val
      },
      deep: true
    },
    examId: {
      handler(val) {
        this.postForm.examId = val
      }
    }
  },
  created() {
    this.postForm.paperIds = this.ids
    this.postForm.examId = this.examId
  },

  methods: {
    handleClose() {
      this.$emit('update:visible', false)
      this.$emit('close')
    },

    handleSettle() {
      this.loading = true
      settle(this.postForm).then(() => {
        this.$message.success('出分结算成功！')
        this.loading = false
        this.handleClose()
      }).catch(() => {
        this.loading = false
      })
    }
  }
}
</script>
